<template>
  <div class="names">
  <show-names :names="names">
    <template v-slot:default="slotProps">
      <h2>{{slotProps.item}} {{slotProps.index }}  {{slotProps.id }}
      </h2>
    </template>
  </show-names>
  </div>
</template>

<script>
import ShowNames from './ShowNames.vue'

export default {
  components: {
    ShowNames
  },
  data() {
    return {
      title: '我还是标题',
      counter: 0,
      names:["why","张三","李四","王五"]
    }
  },
  methods: {
    increment() {
      this.counter++
    },
    decrement() {
      this.counter--
    },
  },
}
</script>

<style scoped>
h2 {
  color: red;
}
</style>
